<section class="vbox">
  <header class="header bg-white b-b b-light">
    <p><i class="fa fa-columns"></i> Grid</p>
  </header>
  <section class="scrollable wrapper">
    <div class="row">
      <div class="col-lg-12">
        <p>Base on Bootstrap grid system, you can get the columns as you want. 12 / (cols) = col-lg-(each-col-width-taken), like 12/3 = col-lg-4, 12/5 = col-lg-2.4 <span class="text-muted">(replace the '.' with '-')</span></p>
      </div>
      <div class="col-lg-12">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-12</div>
        </section>
      </div>
      <div class="col-lg-6">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-6</div>
        </section>
      </div>
      <div class="col-lg-6">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-6</div>
        </section>
      </div>
      <div class="col-lg-4">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-4</div>
        </section>
      </div>
      <div class="col-lg-4">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-4</div>
        </section>
      </div>
      <div class="col-lg-4">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-4</div>
        </section>
      </div>
      <div class="col-lg-3">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-3</div>
        </section>
      </div>
      <div class="col-lg-3">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-3</div>
        </section>
      </div>
      <div class="col-lg-3">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-3</div>
        </section>
      </div>
      <div class="col-lg-3">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-3</div>
        </section>
      </div>
      <div class="col-lg-2-4">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-2-4</div>
        </section>
      </div>
      <div class="col-lg-2-4">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-2-4</div>
        </section>
      </div>
      <div class="col-lg-2-4">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-2-4</div>
        </section>
      </div>
      <div class="col-lg-2-4">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-2-4</div>
        </section>
      </div>
      <div class="col-lg-2-4">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-2-4</div>
        </section>
      </div>
      <div class="col-lg-2">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-2</div>
        </section>
      </div>
      <div class="col-lg-2">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-2</div>
        </section>
      </div>
      <div class="col-lg-2">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-2</div>
        </section>
      </div>
      <div class="col-lg-2">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-2</div>
        </section>
      </div>
      <div class="col-lg-2">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-2</div>
        </section>
      </div>
      <div class="col-lg-2">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-2</div>
        </section>
      </div>
      <div class="col-lg-12">
        <p>Mobile, tablet, and desktop</p>
      </div>
      <div class="col-lg-4">
        <div class="row">
          <div class="col-xs-6">
            <section class="panel panel-default">
              <div class="panel-body">col-xs-6</div>
            </section>
          </div>
          <div class="col-xs-6">
            <section class="panel panel-default">
              <div class="panel-body">col-xs-6</div>
            </section>
          </div>
        </div>
      </div>
      <div class="col-lg-8">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-8</div>
        </section>
      </div>
      <div class="col-lg-6">
        <div class="row">
          <div class="col-sm-6">
            <section class="panel panel-default">
              <div class="panel-body">col-sm-6</div>
            </section>
          </div>
          <div class="col-sm-6">
            <section class="panel panel-default">
              <div class="panel-body">col-sm-6</div>
            </section>
          </div>
        </div>
      </div>
      <div class="col-lg-6">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-6</div>
        </section>
      </div>
      <div class="col-lg-8">
        <div class="row">
          <div class="col-md-6">
            <section class="panel panel-default">
              <div class="panel-body">col-md-6</div>
            </section>
          </div>
          <div class="col-md-6">
            <section class="panel panel-default">
              <div class="panel-body">col-md-6</div>
            </section>
          </div>
        </div>
      </div>
      <div class="col-lg-4">
        <section class="panel panel-default">
          <div class="panel-body">col-lg-4</div>
        </section>
      </div>
      <div class="col-sm-6">
        <section class="panel panel-default">
          <div class="panel-body">col-sm-6</div>
        </section>
      </div>
      <div class="col-sm-6">
        <section class="panel panel-default">
          <div class="panel-body">col-sm-6</div>
        </section>
      </div>
    </div>
  </section>
</section>